<template>
  <h1>博客文章列表</h1>
  <button @click="cmtCount++">cmt +1</button>
  <hr />
  <!-- <BlogArticle :title="'论持久战'" blog-type="军事" :cmt-count="20" :favor="false" /> -->
  <!-- <BlogArticle :title="title" blog-type="军事" :cmt-count="cmtCount" :favor="favor" /> -->
  <!-- <BlogArticle :title blog-type="军事" :cmt-count :favor /> -->
  <!-- <BlogArticle :title="blog.title" blog-type="军事" :cmt-count="blog.cmtCount" :favor="blog.favor" /> -->
  <BlogArticle blog-type="军事" v-bind="blog" />
  <BlogArticle title="星星之火可以燎原" blog-type="文摘" />
</template>

<script setup>
import BlogArticle from './BlogArticle.vue'
import { ref } from 'vue'

const title = ref('论持久战')
const cmtCount = ref(22)
const favor = ref(true)

const blog = ref({
  title: '论持久战2',
  cmtCount: 31,
  favor: false
})
</script>
